<template>
  <!-- #ifdef APP-PLUS || H5 -->
  <!-- 登录 -->
  <view class="container" v-if="guidePages">
    <u-toast ref="uToast" />
    <view class="signbox flex flex-jc-sb">
      <view class="quick">
        <view class="quitext">
          快捷登录注册
        </view>
        <view class="un">
          未注册手机号，系统将自动创建账号
        </view>
      </view>
      <view class="skip" @click="skipindex">
        先看看
      </view>
    </view>
    <view v-show="!pasworcontrol">
      <view class="inpumob">
        <view class="pleasemb" v-if="mobileName">
          请输入手机号
        </view>
        <view class="inpuborder" v-show="!historyInfo">
          <u-input :type="type" :value="namePhone" @input="onInput" placeholder='请输入手机号' maxlength='13' class="inputtext"
            placeholder-style="color: #999999;font-size: 40rpx;" @focus="showSmalltitle" @blur="hideSmalltitle" />
        </view>
        <view class="inpuborder pl-45" v-show="historyInfo">
          <u-input :type="type" :value="namePhone" @input="onInput" placeholder='请输入手机号' maxlength='13' class="inputtext"
            placeholder-style="color: #999999;font-size: 40rpx;" @focus="showSmalltitle" @blur="hideSmalltitle" />
        </view>
      </view>
      <view class="histcss">
        <!-- 历史手机号 -->
        <view class="front-icon" v-show="historyInfo" @click="histricon()">
          <u-icon :class="isFocus ? 'arrow-up' : 'arrow-down'" name="arrow-down-fill" size="22rpx"></u-icon>
        </view>

        <!-- <view class="history-list" v-show="isFocus">
        	<view v-for="(item,index) in historyInfo" :key="index" class="history-item" @touchstart="selHistory(item.mobile)">{{item.mobile}}</view>
        </view> -->
        <scroll-view class="scroll-view_H" v-if="isFocus" scroll-y="true" @scroll="scroll">
          <view class="history-list">
            <view v-for="(item,index) in historyInfo" :key="index" class="history-item">
              <view class="hisnames" @touchstart="selHistory(item.mobile)">
                {{item.mobile}}
              </view>
            </view>
          </view>
        </scroll-view>

      </view>
      <view class="inpumob" v-if="!olduser">
        <view class="pleasemb" v-if="invitationCode">
          输入邀请码有奖励哟（非必填）
        </view>
        <view class="inpuborder">
          <u-input v-model="invitationCode" :type="Yqtype" :clearable="deletebtn" maxlength='6' placeholder='输入邀请码有奖励哟（非必填）'
            placeholder-style="color: #999999;font-size: 40rpx;" @input="clearInput" class="inputtext" @focus="invinputfocus"/>
        </view>
        <view class="success flex flex-jc-fe" v-show="yqsuccess">
          填写成功
          <view class="suicon">
            <i-icon icon="iconiconfontxuanzhong" type="single" size="30rpx" color="#FBBC00"></i-icon>
          </view>
        </view>
        <view class="success flex flex-jc-fe" v-show="yqfail">
          您填写的邀请码无效
          <view class="suicon">
            <i-icon icon="icongantanhao" type="single" size="30rpx" color="#EB5C02"></i-icon>
          </view>
        </view>
      </view>
    </view>
    <view v-show="pasworcontrol">
      <view class="tel">
        <view class="pleasemb">
          请输入密码
        </view>
        <!-- <u-icon class="eye" :name="eye" @click="changePassword" color="#ddd" size="34" v-if="showPasswordClearIcon"></u-icon>
        <view class="input">
          <input class="uni-input uni-input-password" :placeholder="passwordPlaceholder" v-model="Password"
            placeholder-style="color: #999999;font-size: 40rpx;" maxlength="20" minlength="6" @input="clearInputpassword"
            @focus="toggleSmalltitle(0)" @blur="toggleSmalltitle(1)" :password="showPassword" />
          <view class="dele-icon" v-if="showPasswordClearIcon" @click="clearIcon()">
            <i-icon icon="iconshanchu" type="single" size="34rpx" color="#e1e1e1"></i-icon>
          </view>
        </view> -->

        <!-- 输入验证码 -->
        <view class="enter-code mt-20">
          <u-message-input textnumber="password" mode="bottomLine" :width="80" name="Password" v-model="Password" :maxlength="6" :breathe="true"
            :focus="true" active-color="#FBB000" inactive-color="#666" @change="changeInput"></u-message-input>
        </view>
      </view>
    </view>
    <view class="agreement flex mt-20">
      <view class="icons" @click="Agree">
        <!-- 勾选 -->
        <i-icon v-if="isAgree" icon="iconiconfontxuanzhong" type="single" size="30rpx" color="#FBBC00"></i-icon>
        <!-- 未选择 -->
        <i-icon v-else icon="iconiconfontxuanzhong" type="single" size="30rpx" color="#e1e1e1"></i-icon>
      </view>
      我已阅读并同意<text @click="gouserAgreementPage(0)">《用户使用协议》</text>和<text @click="gouserAgreementPage(1)">《隐私政策》</text>
    </view>
    <view class="buttons">
      <!-- 灰色 -->
      <view class="buth" v-if="!nextStepstat">
        下一步
      </view>
      <!-- 点亮 -->
      <view class="butcolo" v-if="nextStepstat" @click="nextStep()">
        下一步
      </view>
    </view>
    <view class="passbox" @click="passSMSlclick">
      {{passwordSMSLogin}}
    </view>
    <view class="">

    </view>
    <!-- #ifdef APP-PLUS -->
    <view v-if="weixlogin">
      <view class="flex flex-ai-c flex-jc-c" style="margin-top: 70rpx;">
        <view class="line"></view>
        <view class="qitalogin">
          其他登录方式
        </view>
        <view class="line"></view>
      </view>
      <view class="flex flex-jc-sb" style="padding: 0rpx 30rpx;margin-top: 45rpx;">
        <view class="1234" @click="weixinClick()">
          <i-icon icon="iconweixin" type="single" size="90rpx" color="#09bb07"></i-icon>
        </view>
        <view class="1234" @click="zhifubaoClick()">
          <i-icon icon="iconzhifubao" type="single" size="90rpx" color="#B9B9B9"></i-icon>
        </view>
        <view class="1234" @click="pingguoClick()">
          <!-- <i-icon icon="iconqq" type="single" size="90rpx" color="#18b6ed"></i-icon> -->
          <i-icon icon="iconqq" type="single" size="90rpx" color="#B9B9B9"></i-icon>
        </view>
      </view>
    </view>
    <!-- #endif -->
    <!-- 免责弹窗 -->
    <view class="uni-popup" v-if="showPopup">
      <view class="main">
        <user-agreement-popup></user-agreement-popup>
        <view class="popup-footer">
          <view class="disagreeBtn" @tap="agreepopup(0)">不同意</view>
          <view class="agreeBtn" @tap="agreepopup(1)">同意</view>
        </view>
      </view>
    </view>
  </view>
  <!-- #endif -->
  <!-- #ifdef MP-WEIXIN -->
  <view class="wx-login">
    <view class="logo-wrap">
      <image class="logo-img" src="https://files.yzsheng.com/client/weixin/logo.png"></image>
      <view class="logo-text">
        买车、养车就找7迈车
      </view>
    </view>
    <view class="btn-wrap">
      <button open-type="getPhoneNumber" @getphonenumber="decryptPhoneNumber">微信用户一键登录</button>
      <view class="btn-text">
        登录后推荐更多优质车源
      </view>
    </view>
  </view>
  <!-- #endif -->
  
</template>

<script src="./login.js"></script>

<style lang="scss" scoped>
  @import './login.scss';
</style>
